<template>
	<view class="">
		
		<!-- 页头增高垫 -->
		 <view style="height: 40rpx; background-color:#0aa1ed;"></view> 
		<!-- 页头 -->
		<xz-header :idata="data" :uname="uname" :isNotLogin="isNotLogin" @changeLoginState='changeHeaderloginState'></xz-header>
		<!-- list标题 1f-->
		<xz-index-list-title 
		title="首页推荐 /1F" 
		subtitleUrl='../../pages/category/category'
		subtitle="更多">
		</xz-index-list-title>
		
		<!-- 首页商品list 1f -->
		<view style="display: flex; justify-content: space-around; flex-wrap: wrap;">
			<view v-for="item in data.recommendedItems" :key='item.pid'>
			<xz-index-list-item
				:item_src="$url.baseURL+item.pic"
				:item_title="item.title"
				:item_subtitle="'￥'+item.price"
				item_buttonText="查看详情"
				:item_pid="item.pid"
			></xz-index-list-item>
			</view>
		</view>
		<!-- 首页商品list 1f end -->
		
		<!-- list标题 2f-->
		<xz-index-list-title
		title="最新上架 /2F" 
		subtitleUrl='../../pages/category/category'
		subtitle="更多">
		</xz-index-list-title>
		
		<!-- 首页商品list 2f -->
		<view style="display: flex; justify-content: space-around; flex-wrap: wrap;">
			<view v-for="F2item in data.newArrivalItems" :key='F2item.pid'>
				<xz-index-list-item
				:item_src="$url.baseURL+F2item.pic"
				:item_title="F2item.title"
				:item_subtitle="'￥'+F2item.price"
				:item_pid="F2item.pid"
				item_buttonText="查看详情"
				>
				</xz-index-list-item>
			</view>
		</view>
		<!-- 首页商品list 2f end -->
		
		<!-- list标题 3f-->
		<xz-index-list-title
		title="热销单品 /3F" 
		subtitleUrl='../../pages/category/category'
		subtitle="更多">
		</xz-index-list-title>
		<!-- 首页商品list 3f -->
		<view style="display: flex; justify-content: space-around; flex-wrap: wrap;">
			<view v-for="F3item in data.topSaleItems" :key='F3item.pid'>
				<xz-index-list-item
				:item_src="$url.baseURL+F3item.pic"
				:item_title="F3item.title"
				:item_subtitle="'￥'+F3item.price"
				:item_pid="F3item.pid"
				item_buttonText="查看详情"
				></xz-index-list-item>
			</view>
		</view>
		<!-- 首页商品list 3f end -->
		<!-- 返回顶部 -->
		<xz-go-top></xz-go-top>
		<!-- 页脚 -->
		<xz-footer></xz-footer>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				uname:'',
				data:{},
				isNotLogin:true
			}
		},
		onLoad() {
			uni.request({
				method:"GET",
				url:this.$url.index,
				success: (res) => {
					this.data = res.data
					 console.log(this.data);
					uni.showLoading({
						title:'数据加载中',
						mask:true,
					})
				},
				fail: (err) => {
					console.log(err)
				},
				complete: () => {
					uni.hideLoading()
				}
			})
		},
		onShow() {
			console.log('首页被显示了');
			this.isNotLogin = getApp().globalData.isNotLogin
			this.uname = getApp().globalData.userName
			console.log('从app对象中获取到app从login组件获取到的userName:',this.uname);
		},
		methods: {
			changeHeaderloginState(){
				this.isNotLogin=!this.isNotLogin
			}
		}
	}
</script>

<style>

</style>
